$(function() {
    load();
    $('#title').on('keydown',function(e){
        
            if(e.keyCode === 13){
                if($(this).val() ===''){
                    alert('请输信息')
                }else {
                    var local = getDate();
                    // console.log(local);
                    local.push({ title: $(this).val(),done:false});
                    // 把数组存储给本地数组
                    saveDate(local);
                    load();
                    $(this).val('')
                }
               
            }
        
       
    });
    //3.todolist 删除操作
    $('ol ,ul').on('click','a',function(){
        var data = getDate();
        var index = $(this).attr('id');
        // console.log(index);
        data.splice(index,1)
        saveDate(data);
        load();
    })
    $('ol,ul').on('click','input',function(){
        var data = getDate();
        var index = $(this).siblings('a').attr('id');
        data[index].done = $(this).prop('checked');
        saveDate(data);
        load();
    })
    //读取本地存储的数据
    function getDate(){
        var data = localStorage.getItem('todolist');
        if(data !== null){
            return JSON.parse(data);
        }else {
            return [];
        }
    }
//保存本地存储的数据
    function saveDate(data){
        localStorage.setItem('todolist',JSON.stringify(data));
    }
    function load() {
        var todocount = 0;
        var donecount = 0;
        var data = getDate();
        //遍历之前先清空ol里面的元素
        $('ol,ul').empty();
        $.each(data,function(i,n){
            if(n.done){
                $('ul').prepend("<li><input type='checkbox' checked = 'checked'> <p>"+n.title+"</p><a href='javascript:;' id ="+i+" ></a></li>")
                donecount++;
            }else{
                $('ol').prepend("<li><input type='checkbox'> <p>"+n.title+"</p><a href='javascript:;' id ="+i+" ></a></li>")
                todocount++;
            }
            
        })
        $("#todocount").text(todocount);
        $("#donecount").text(donecount);

    }
})